import { Meta } from '@storybook/blocks';

import * as IndexedStackStories from '../stories/IndexedStack.stories';

<Meta of={IndexedStackStories} />

# IndexedStack

A Stack that shows a single child from a list of children.

## Example

```dart liveslice=IndexedStack height=400px
int _index = 0;

@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      Container(
        height: 300,
        child: IndexedStack(
          index: _index,
          children: <Widget>[
            Container(
              color: Colors.pink,
              child: Center(
                child: Text('Page 1'),
              ),
            ),
            Container(
              color: Colors.cyan,
              child: Center(
                child: Text('Page 2'),
              ),
            ),
            Container(
              color: Colors.deepPurple,
              child: Center(
                child: Text('Page 3'),
              ),
            ),
          ],
        ),
      ),
      Row(
        mainAxisSize: MainAxisSize.max,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          FlatButton(
            onPressed: () {
              if (_index <= 0) return;
              setState(() {
                _index -= 1;
              });
            },
            child: Text(
              "Prev",
            ),
          ),
          FlatButton(
            onPressed: () {
              if (_index >= 2) return;
              setState(() {
                _index += 1;
              });
            },
            child: Text(
              "Next",
            ),
          )
        ],
      )
    ],
  );
}
```

## Related Links

- https://api.flutter.dev/flutter/widgets/IndexedStack-class.html
